<meta charset="UTF-8">
	        <table id="table1"  style="border-collapse: collapse;border: none;width: 100%;height: 100%">
	        	<tr align="center" style="height: 50px">
	        		<td colspan="2" style="border: solid #000 1px;">匹配管理</td>
	        	</tr>
	        	<tr align="center" style="height: 50px">
	        		<td style="width: 50%;border:solid #000 1px;">已匹配项</td>
	        		<td style="width: 50%;border:solid #000 1px;">待选匹配</td>
	        	</tr>
	        	<tr style="height: 500px;width: 100%">
	        		<td style="width: 50%;border:solid #000 1px;">
	        			<table style="height: 80%;width: 100%;border-collapse: collapse;border: none;">
	        				<#list queryByIdsList as fundList>
	        				<tr align="center">
	        					<td style="border: solid #000 1px;">
	        						<div class="container">
									    <div class="information">
									        <figure>
									            <img src="${zhaorongbaoFileUrl}/${fundList.pic}" alt=""/>
									            <figcaption>
									                <hgroup>
									                    <h2 class="title">${fundList.titlesVal}</h2>
									                    <h3>所属行业：${fundList.industryName}</h3>
									                </hgroup>
									                <div class="funds">${fundList.investModeName} | <span>${fundList.total}万</span></div>
									                <div class="time">${fundList.destinationName} | ${fundList.pushTime?string('yyyy-MM-dd HH:mm:ss')}</div>
									            </figcaption>
									            <a class="a-btn" href="javascript:openDetail('${fundList.id}')">查看详情</a>
									        </figure>
									    </div>
									</div>
	        					</td>
	        				</tr>
	        				</#list>
	        				
	        			
	        			</table>
	        		</td>
	        		
	        		<td style="width: 50%;border:solid #000 1px;">
	        		<table style="width: 100%;height: 100%">
	        			<tr style="height: 10%">
	        				<td >
	        				<div align="center" style="text-align: center; vertical-align:middle;">
			        				<!-- <input width="200px" name="suzuki" id="suzuki" required="true"> -->
			        				选择匹配规则
				        		</div>
				        		<div align="center" style="text-align: center; vertical-align:middle; width: 100%; height: 100%;margin-top: 5px;margin-bottom: 5px;">
							     	
							     	<select id="cc" class="easyui-combobox" style="width:300px;" > 
							     	   <option>请选择</option>  
									   <option value="0">全部</option>   
									   <option value="1">第一匹配规则</option>   
									   <option value="2">第二匹配规则</option>   
									   <option value="3">第三匹配规则</option>   
									</select> 
							     </div>
	        				<table
									     class="easyui-datagrid"   
									     id="datagridasd"  
								         url="${base}/project/queryMarryFundList?id=${id}&type=${type}"
								         pagination="true"
								         rownumbers="true" 
								         data-options="pageSize:20,pageList:[2,10,20,30]" >  
								    <thead>  
								        <tr> 
								            <th field="titlesVal" width="15%">资金名称</th>
								            <th field="fundNo" width="9%">资金编号</th>  
								            <th field="industryName" width="13%">投资行业</th>
								            <th field="destinationName" width="13%">投资地区</th>  
								            <th field="userPhone" width="13%">手机号</th> 
								            <th field="userName" width="7%">发布人</th>
								            <th field="total" width="13%">投资金额（万）</th>
								            <!-- <th field="investModeName" width="9%">投资方式</th>
								            <th field="stateName" width="9%">资金状态</th>     
								            <th field="authName"  width="9%">认证状态</th> -->  
								            <th field="pushTime" width="18%">发布时间</th>  
								            <!-- <th field="descrition" width="8%">资金简介</th>  
								            <th field="requirement" width="8%">备注</th>   -->
								        </tr>
								    </thead>
								</table>  
	        				</td>
	        			</tr>
	        			<tr style="height: 90%;width: 100%">
	        				<td>
	        					
	        				</td>
	        			</tr>
	        		</table>
	        			  
	        		</td>
	        	</tr>
	        </table>      

<script type="text/javascript">

$(function(){
    $('#cc').combobox({  
    	editable:false,
    	onChange : function(){
    		var level = $("#cc").combobox('getValue');
    			
    			var handler = '${base}/project/queryMarryFundList?id=${id}&type=${type}&level='+level;
                $('#datagridasd').datagrid('options').url = handler;
                $('#datagridasd').datagrid('reload'); 
    			
    			/* $.ajax({
    			     type: 'POST',
    			     url: 'project/queryMarryFundList?id=${id}&level='+level 
    			}); */
    		}  
   });  
});

$(function () {
	$('#suzuki').combobox({   
        url:'dictionary/getDictionaryByParentCode?parentCode=300',   
        editable:false, //不可编辑状态  
        cache: false,  
        //panelHeight: '150',//自动高度适合  
        valueField:'itemCode',     
        textField:'itemName'  
     }); 
})

	function openDetail(id){
	//alert('${mobileDomain}/projectApi/getProjectDetail?id='+id);
    var href= '${mobileDomain}/fund/detail?id='+id;
    var windowWidth =$(window.parent).width();
    var windowHeight=$(window.parent).height();
    var width=380;
    var height=windowHeight-200;
    var top=(windowHeight-height)/2;
    var left=(windowWidth-width)/2;
    var $win2 = $('#preView').window({
   	   content : '<iframe scrolling="yes" frameborder="0"  src="'  
              + href  
              + '" style="width:100%;height:98%;"></iframe>',  
        title: 'APP预览',
        width: width,
        height: height,
        top: top,
        left: left,
        shadow: true,
        modal: true,
        closed: true,
        minimizable: false,
        maximizable: false,
        collapsible: false
    });

    $win2.window('open');
}
</script>

<style>
        body,h1,h2,h3,h4,p,ul,ol,form,fieldset,figure {
            margin: 0;
            padding: 0;
            font-size: 14px;
        }
        body {
            font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei UI", "Microsoft YaHei", SimHei, "\5B8B\4F53", simsun, sans-serif;
        }
        ul,ol {
            list-style: outside none none;
        }
        a
        {
            text-decoration: none;
        }
        img {
            display: block;
        }
        div,figure,figcaption{
            box-sizing: border-box;
        }
        /*默认 100px*/
        .container{
            width: 700px;
            margin: 0 auto;
        }
        .information{
            color: #666;
            margin: 0.15rem auto;
            padding: 0 0.1rem;
        }
        .information h2{
            font-size: 16px;
            padding: 0 0 15px 0;
        }
        .information img{
            float: left;
            width: 100px;
            height: 100px;
            margin-right: 20px;
        }
        .information figure{
            padding: 15px 0 0 0;
            position: relative;
        }
        .information figure:after{
            content: '.';
            display: block;
            clear: both;
            height: 0;
            visibility: hidden;
        }
        .information figure figcaption{
            float: left;
        }
        .information .title{
            border-bottom: 0;
            padding: 0 0 5px 0;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
        .information h3{
            overflow: hidden;
            text-overflow: ellipsis;
            font-weight: normal;
            padding: 0;
            display: -webkit-box;
            -webkit-line-clamp: 1 ;
            -webkit-box-orient: vertical;
            font-size: 14px;
            line-height: 2;
        }
        .information .time,.information .funds{
            position: absolute;
            bottom: 0;
            left: 120px;

        }
        .information .funds span{
            color: #7C95ED;
        }
        .information .time{
            left:300px;
            color: #999;
        }
        .information .a-btn{
            float: right;
            display: block;
            width: 100px;
            height: 100px;
            text-align: center;
            line-height: 100px;
            background: #f60;
            color: #ffffff;
        }
    </style>